<template>
  <el-dialog
    :title="diaOption.title"
    :visible.sync="diaOption.visible"
    :width="diaOption.width"
    :fullscreen="diaOption.fullscreen"
    :top="diaOption.top"
    :modal="diaOption.modal"
    :modal-append-to-body="diaOption.modalAppendToBody"
    :append-to-body="diaOption.appendToBody"
    :lock-scroll="diaOption.lockScroll"
    :custom-class="diaOption.customClass"
    :close-on-click-modal="diaOption.closeOnClickModal"
    :close-on-press-escape="diaOption.closeOnPressEscape"
    :show-close="diaOption.showClose"
    :before-close="diaOption.beforeClose"
    :center="diaOption.center"
    :destroy-on-close="true">

    <span slot="footer">
      <el-button @click="handleDialogCancel">取 消</el-button>
      <el-button type="primary" @click="handleDialogSure">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
  export default {
    name: "dialogTpl",
    props:{
      diaOption:{  //继承element-ui dialog的属性,属性中有横杠的使用驼峰命名，例:show-close对应showClose
        type:Object,
        default:function () {
          return {}
        }
      }
    },
    components:{  },
    mounted(){

    },
    methods:{
      handleDialogCancel(){
        this.$emit('dialogBtnClick','cancel');
      },
      handleDialogSure(){
        this.$emit('dialogBtnClick','sure');
      }
    }
  }
</script>

<style scoped>

</style>
